{include="header"}

<script type="text/javascript">
   $(document).ready(function() {
      $("#b_nuevo_clan").click(function(event) {
         event.preventDefault();
         $("#modal_nuevo_clan").modal('show');
         document.f_nuevo_clan.nombre.focus();
      });
   });
</script>

<ul class="nav nav-tabs">
   <li>
      <a href="{$fsc->url()}">
         <span class="glyphicon glyphicon-refresh" aria-hidden="true"></span>
      </a>
   </li>
   <li class="active">
      <a href="#home">Clanes</a>
   </li>
   <li>
      <a href="#nuevo" id="b_nuevo_clan">
         <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> &nbsp; Nuevo
      </a>
   </li>
</ul>

<div class="container-fluid" style="margin-top: 10px;">
   <div class="row">
      {loop="$fsc->clan->all()"}
      <div class="col-md-4">
         <a href="{$value->url()}">{$value->nombre}</a>
      </div>
      {else}
      <div class="col-md-12">
         <div class="alert alert-warning">Sin resultados.</div>
      </div>
      {/loop}
   </div>
</div>

<div class="modal" id="modal_nuevo_clan">
   <div class="modal-dialog">
      <div class="modal-content">
         <div class="modal-header">
            <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
            <h4 class="modal-title">Nuevo clan familiar</h4>
         </div>
         <div class="modal-body">
            <form id="f_nuevo_clan" name="f_nuevo_clan" action="{$fsc->url()}" method="post" class="form">
               <div class="input-group">
                  <input class="form-control" type="text" name="nombre" placeholder="Nombre" autocomplete="off"/>
                  <span class="input-group-btn">
                     <button class="btn btn-primary" type="submit">
                        <span class="glyphicon glyphicon-floppy-disk"></span>
                     </button>
                  </span>
               </div>
            </form>
         </div>
      </div>
   </div>
</div>

{include="footer"}